<?php include COMMON_PATH.'/index/header.html' ?>
<link rel="stylesheet" href="/index/js/swiper/swiper.min.css">
<link href="/index/js/libs/scroll-bar/jquery.mCustomScrollbar.css" rel="stylesheet" type="text/css"/>
<link href="/index/css/live.css" rel="stylesheet" type="text/css"/>
<div class="main-content">
    <!--回放-->
    <div class="home-live-content clearfix">
        <div class="live-left-content ">
            <div class="top">
                <span class="btn-view-mini">培训时间</span>
                <p class="train-time"><?=$play['date']?>  <?=$play['start_time']?>-<?=$play['end_time']?></p>
            </div>
            <div class="train-brief-wrap">
                <div class="train-brief-sm-wrap scroll-common-wrap">
                    <h3>课程简介</h3>
                    <p class=""><?=$play['introduction']?></p>
                </div>
            </div>
            <?php if(!empty($play['annex'])):?>

            <!--禁止看课件start  php-define  -->
            <div class="slide-wrap swiper-container swiper-container-horizontal">
                <!-- Add Pagination -->
                <div class="top">
                    <span class="title">课件</span>
                    <div class="swiper-pagination swiper-pagination-fraction"><span
                            class="swiper-pagination-current"></span>/<span class="swiper-pagination-total"></span>
                    </div>
                </div>
                <i class="icon-plus am-icon-search-plus"></i>
                <div class="swiper-wrapper">

                    <?php foreach($play['annex'] as $v):?>
                    <div class="swiper-slide swiper-slide-active" style="">
                        <img class="avatar" src="<?=$v?>" onerror="iService.imgNoFind(this)">
                    </div>
                    <?php endforeach;?>
                </div>
                <!-- Add Arrows -->
                <div class="swiper-button-next"></div>
                <div class="swiper-button-prev"></div>
            </div>
            <!--禁止看课件end-->


            <?php endif;?>
            <div class="code-wrap clearfix">
                <img class="code fl" src="/index/img/code-down.png" alt="">
                <div class="fr">
                    <p class="justify">扫一扫用手机观看</p>
                    <a href="javascript:void(0);"><span class="am-icon-apple">&nbsp;&nbsp;</span>App Store下载</a>
                    <a href="javascript:void(0);"><span class="am-icon-android">&nbsp;&nbsp;</span>Android下载</a>
                </div>
            </div>
        </div>
        <div class="live-mid-content ">
            <div class="top">
                <img class="avatar" src="<?=$play['avatar']?>" onerror="iService.imgNoFind(this)">
                <div class="info">
                    <p class="tips"><span><?=$play['name']?></span>讲师：<span
                            class="host-name"><?=$play['nickname']?></span></p>
                    <p>
                        <?php if(!empty($play['volume'])):?>
                        <a href="/Question/answer?llid=<?=$play['llid']?>"><span class="icon-view-2">考试</span></a>
                        <?php endif;?>
                        <a href="/Course/score?llid=<?=$play['llid']?>">
                                   <span class="icon-view-3 icon-view-4">
                                    <b>好评</b><i><?=$play['rate']?>%</i>
                                </span>
                        </a>
                        <span class="icon-view-3">
                                <b>累计</b><i><?=$play['viewing']?></i>
                            </span>
                    </p>
                </div>
            </div>
            <div id="video-train"></div>
        </div>

        <!--禁止分享则隐藏以下标签start  php-define -->
        <div class="live-right-content">
            <div class="top">
                <?php if($play['share']):?>
                <p>分享到微信：<a href="javascript:void(0)" class="am-icon-weixin"></a></p>
                <?php endif;?>
            </div>

            <div class="scroll-common-wrap view-man-wrap">
                <ul class="good-list-wrap">

                    <?php foreach($play['watch'] as $k => $v ):?>
                    <li class="clearfix">
                        <i class="rank-num"><?=$k+1?></i><img class="avatar" src="<?=$v['avatar']?>" onerror = "iService.imgNoFind(this)">
                        <div class="user-info">
                            <p><?=$v['nickname']?></p>
                            <p><?=$v['section']?> - <?=$v['duties']?></p>
                        </div>
                        <img style="margin: 8px 30px 0 0;" class="icon-finish fr" src="/index/img/icon-finish.png" alt="">
                    </li>
                    <?php endforeach;?>

                </ul>
            </div>
        </div>
        <!--禁止分享则隐藏以下标签end-->
    </div>
</div>
<?php include COMMON_PATH.'/index/footer.html' ?>
<script src="/index/js/libs/scroll-bar/jquery.mCustomScrollbar.js"></script>
<script type="text/javascript" src="/index/js/swiper/swiper.min.js"></script>
<script type="text/javascript" src="/index/sdk/TcPlayer-2.2.0.js"></script>
<script type="text/javascript" src="/index/js/libs/qrcode.min.js"></script>

<script>
    navActive(1);

    var scroll_Init = function () {
        var content = $(".scroll-common-wrap"), autoScrollTimer = 500, autoScrollTimerAdjust;
        content.mCustomScrollbar({
            scrollButtons: {enable: false},
            callbacks: {
                whileScrolling: function () {
//                    autoScrollTimerAdjust=autoScrollTimer*this.mcs.topPct/100;
                },
                onScroll: function () {
                }
            }
        });
    };
    scroll_Init();

    $(function () {
//        课件可看条件 php-define  1可看，其它不可看
        var flag = "<?=$play['view']?>";
        if (flag == 1) {
            var my_swiper = new Swiper('.slide-wrap', {
                nextButton: '.swiper-button-next',
                prevButton: '.swiper-button-prev',
                pagination: '.swiper-pagination',
                autoplay: '1500',
                loop: true,
                paginationType: 'fraction'
            });


        }
        layui.use(['element', 'layer', 'laypage', 'laydate'], function () {
            var layer = layui.layer //获得layer模块
                , laypage = layui.laypage //获得laypage模块
                , laydate = layui.laydate //获得laydate模块
                , element = layui.element;
            $('.icon-plus').on('click', function () {
                var ppt_img_el = $('.swiper-wrapper').html();
                my_swiper.stopAutoplay();
                console.log(my_swiper);
                layer.open({
                    area: ['1000px', '700px'],
                    type: 1,
                    title: false,
                    resize: false,
                    shadeClose: false,
                    content: '<div class="swiper-pic-wrap">' + $('.swiper-slide-active').html() + '</div>',
                    /*content:
                    '<div class="slide-big-wrap swiper-container swiper-container-horizontal">'+
                        '<div class="swiper-wrapper">'+
                         ppt_img_el+

                        '</div>'+
                    '<div class="swiper-pagination swiper-pagination-fraction"><span class="swiper-pagination-current"></span>/<span class="swiper-pagination-total"></span></div>'+
                    '<div class="swiper-button-next"></div>'+
                    '<div class="swiper-button-prev"></div>'+
                    '</div>',*/
                    success: function (layero, index) {
                        /*var my_big_swiper = new Swiper('.slide-big-wrap', {
                            nextButton: '.swiper-button-next',
                            prevButton: '.swiper-button-prev',
                            pagination: '.swiper-pagination',
                            observer:true, //修改swiper自己或子元素时，自动初始化swiper
                            observeParents:true, //修改swiper的父元素时，自动初始化swiper
                            // autoplay:'1500',
                            loop:true,
                            initialSlide: my_swiper.activeIndex-1,
                            paginationType: 'fraction',
                            onInit: function(swiper){
                                //Swiper初始化了
                                //alert(my_swiper.activeIndex);提示Swiper的当前索引
                            }
                        });*/

                    },
                    cancel: function (index, layero) {
                        my_swiper.startAutoplay();
                    }
                });
            });
            $('.am-icon-weixin').on('click', function () {
                layer.open({
                    area: ['300px', '300px'],
                    type: 1,
                    title: false,
                    resize: false,
                    shadeClose: false,
                    content: '<div class="code-share-wx-wrap"><div id="qrcode"  /><p>微信扫一扫分享到手机</p></div>',
                    success: function () {
                        var qrcode = new QRCode(document.getElementById("qrcode"), {
                            width: 120,
                            height: 120
                        });
                        qrcode.makeCode('http://' + '<?=$_SERVER["HTTP_HOST"]?>/Share/live/index?llid=<?=$play["llid"]?>');
                    }
                });
            });

            //回放 9代表回放  2代表直播   <?=$play['status']?>;
            var video_height = "<?=$video['url']['transcodeList'][0]['height']?>",
                video_width = "<?=$video['url']['transcodeList'][0]['width']?>",
                play_url = "<?=$video['url']['transcodeList'][0]['url']?>",
                flv_mp4 = "<?=$video['url']['transcodeList'][1]['url']?>",
                live_height = 712,
                live_width = live_height * video_width / video_height;

            var player = new TcPlayer('video-train', {
                rtmp: "",
                "m3u8": play_url,
                "flv": flv_mp4, //增加了一个flv的播放地址，用于PC平台的播放
                "autoplay": true,      //iOS下safari浏览器是不开放这个能力的
                "flash": false,
                "coverpic": {"style": "cover", "src": "<?=$play['image']?>"},
                "width": live_width,//视频的显示宽度，请尽量使用视频分辨率宽度
                "height": live_height, //视频的显示高度，请尽量使用视频分辨率高度
                "controls": "",
                "live": false,
                wording: {
                    2032: '请求视频失败，请检查网络',
                    2048: '请求m3u8文件失败，可能是网络错误或者跨域问题'
                },
                listener: function (msg) {
                    // console.log(msg);
                    var play_btn = $(".play-btn");

                    function showPlayBtn() {
                        if (player.playing()) {
                            play_btn.hide();
                        } else {
                            play_btn.show();
                            play_btn.on("click", function () {
                                player.play();
                                showPlayBtn();
                            });
                        }
                    }

                    showPlayBtn();
                }
            });

        });
    });
</script>
</html>



























